/** @type {import('tailwindcss').Config} */
export default {
  content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
  darkMode: 'class',
  theme: {
    screens: {
      sm: '480px',
      md: '768px',
      lg: '976px',
      xl: '1440px'
    },
    colors: {
      'main': '#00a87b',
      'white': '#ffffff',
      'black': '#000000',
      'f1': '#f1f1f1',
      'f2': '#f2f2f2',
      'f3': '#f3f3f3',
      'f4': '#f4f4f4',
      'f5': '#f5f5f5',
      'f6': '#f6f6f6',
      'f7': '#f7f7f7',
      'f8': '#f8f8f8',
      'f9': '#f9f9f9',
      'red': 'red',
      'gray': '808080',
      'lightgray':'#0c1c1e',

      // 'red':'#f35858',
      // 'white':'#ffffff',
      // 'blue': '#1fb6ff',
      // 'purple': '#7e5bef',
      // 'pink': '#ff49db',
      // 'orange': '#ff7849',
      // 'green': '#13ce66',
      // 'yellow': '#ffc82c',
      // 'gray-dark': '#273444',
      // 'gray': '#8492a6',
      // 'gray-light': '#d3dce6'
    },
    fontFamily: {
      sans: ['Graphik', 'sans-serif'],
      serif: ['Merriweather', 'serif']
    },
    extend: {
      spacing: {
        '128': '32rem',
        '144': '36rem'
      },
      borderRadius: {
        '4xl': '2rem'
      }
    },
    borderRadius: {
      'none': '0',
      'sm': '.125rem',
      DEFAULT: '.25rem',
      'lg': '.5rem',
      'full': '9999px'
    }
  },
  plugins: []
}

